<template>
	<view class="time" :style="{paddingTop: paddingHeight + 'px'}">
		<nav-bar></nav-bar>
		<view class="t-h-container">
			<view class="t-h-title">
				时间
			</view>
			<view class="t-h-sub-title">
				填写本次餐别摄入时间
			</view>
			<view class="time_s" @click="showStartTime = true">
				{{ time }}
			</view>
		</view>
		<view class="large_button" @click="$u.throttle(next, 1500)">
			下一步
		</view>
		<u-datetime-picker @confirm="selectStartTime" @cancel="showStartTime = false" @close="showStartTime = false"
			:show="showStartTime" v-model="time" closeOnClickOverlay mode="time"></u-datetime-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				paddingHeight: uni.getStorageSync('navbarHeight'),
				userId: uni.getStorageSync("userId"),
				showStartTime: false,
				type: undefined, // 餐別类型
				time: '00:00'
			}
		},
		onLoad(OPTIONS) {
			this.type = OPTIONS.meal
			this.day = OPTIONS.day
		},
		methods: {
			// 跳转
			next() {
				uni.redirectTo({
					url: `/pagesA/health/device/info/diet/add?time=${this.time}&type=${this.type}&day=${this.day}`
				})
			},
			selectStartTime() {
				this.showStartTime = false
			}
		}
	}
</script>


<style lang="scss">
	page {
		background-color: #FAFAFA;
		min-height: 100%;
	}
</style>
<style lang="scss" scoped>
	.time {
		.time_s {
			width: 270rpx;
			height: 134rpx;
			margin: 160rpx auto 0;
			color: #545DDE;
			border-bottom: 4rpx solid #545DDE;
			font-weight: 500;
			font-size: 96rpx;
			font-family: PingFangSC-Medium, PingFang SC;
		}

		.large_button {
			position: fixed;
			bottom: 76rpx;
			left: 50%;
			transform: translateX(-50%);
		}
	}
</style>